<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/kcgl.css">
    <link rel="stylesheet" href="../css/yjxxsz_nav.css">
    <script src="../javascript/kcgl.js"></script>
    <script src='../lib/bootstrap-3.3.5-dist/js/jquery-3.6.0.js'></script>
    <script src='../lib/bootstrap-3.3.5-dist/js/bootstrap.min.js'></script>
    <link rel="stylesheet" href="../lib/bootstrap-3.3.5-dist/css/bootstrap.min.css">
</head>
<body>
  <header id="header" class="clearfix">
    <span>经销存管理系统</span>
    <div class="clearfix">
        <div>
            <span class="glyphicon glyphicon-triangle-bottom"></span>
        </div>
        <div>管理员</div>
        <div>
            <span class="glyphicon glyphicon-user"></span>
        </div>
</header>
<div id="left_nav">
    <div id="nav">
        <li id="nav_header">
            <span class="glyphicon glyphicon-cog"></span>
            系统菜单
            <span class="glyphicon glyphicon-chevron-down"></span>
        </li>
        <li page-data='page1'>分类管理</li>
        <li page-data='page2'>库存管理</li>
        <li page-data='page3'>入库管理</li>
        <li page-data='page4'>预警信息设置</li>
        <li page-data='page5'>出库管理</li>
        <li page-data='page6'>用户管理</li>
        <li page-data='page7'>修改密码</li>
    </div>
</div>
<div id="content">
  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
      <div class="modal-content">

      </div>
    </div>
    </div>
    <div id="box">
    <div class="clear">
    <ul id="chuku" >
        <li onclick="tabClick(this,0)" class="li1">库存管理</li>
        <li onclick="tabClick(this,1)" class="li1">添加商品</li>
    </ul>
    </div>
    <div id="content" class="clear">
        <!-- 表格 -->
        <div id="content_table" class="content1">
            <table id="mytable" algin="center" border="" style="border-collapse: collapse;"  >
                <thead>
                  <tr>
                    <th>库存编号</th>
                    <th>商品名称</th>
                    <th>商品分类</th>
                    <th>商品数量</th>
                    <th>编辑</th>
                    <th>删除</th>
                  </tr>
                </thead>
                <tbody id="caozuo">
          
                </tbody>
            </table>
            <!-- 分页 -->
            <nav id='yema' aria-label="Page navigation" class="clear">
                
                <!-- <div id='eachPage' class="dropup">
                  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown"
                    aria-haspopup="true" aria-expanded="false">
                    每页10条
                    <span class="caret"></span>
                  </button>
                <!-- 点击显示每页具体分页数 -->
                <!-- <ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
                    <li class='menuPage' value="10">每页10条</li>
                    <li class='menuPage' value="20">每页20条</li>
                    <li class='menuPage' value="50">每页50条</li>
                  </ul>
                </div> --> 
                <!-- 上一页下一页箭头 -->
                <div class="pagination clear">
                  <div id="pre" onclick="prePage()">
                    <a href="#" aria-label="Previous" >
                      <span aria-hidden="true">&laquo;</span>
                    </a>
                  </div>
                  <div id="pageNum"></div>
                  <div id="next" onclick="nextPage()">
                    <a href="#" aria-label="Next">
                      <span aria-hidden="true">&raquo;</span>
                    </a>
                  </div>
                </div>
              </nav>
        </div>
        <!-- 提交内容框  -->
        <div id="content_xinxi" class="content1" style="margin: auto;">
                <div class="neirong clear">
                    <p class="xsmt1">
                    <span>商品名称</span> <input type="text" value="商品名称">
                    <p class="zuo" style="width: 100px;">10字以内...</p>
                    </p>
                    <p class="xsm1">
                        <span>分类</span> <select id="ckmc" value=>
                            <option selected hidden disabled value="">请选择分类</option>
                              <option value ="商品1">分类1</option>
                              <option value ="商品2">分类2</option>
                              <option value ="商品3">分类3</option>
                              <option value ="商品4">分类4</option>
                              <option value ="商品5">分类5</option>
                            </select>
                    <p class="zuo" style="width: 100px;">群组</p>
                    </p>
                    <p class="xsmt1">
                    <span>备注：</span><textarea id = "beizhu" class="" value="" placeholder="输入备注">
                       
                    </textarea>
                    <p class="er">250字以内...</p>
                    </p>
                    <button id="anniu" onclick="addck()">添加分类</button>
                </div>  
        </div>
    </div>
    </div>
</div>
   
</body>
<script>
   let h = $(window).height()
    let h_judge
    $('#left_nav').css({
      'height': h + 'px',
    })
    $('#nav>li:first-child').on('click', function () {
      pullDown($(this))
    })
    $('#nav>li:first-child').siblings().on('click', function () {
      jumpPage($(this))
    })
    function pullDown(obj) {
        let num = obj.siblings().length + 1
        if (!h_judge) {
            obj.parent().css({
                'height': num * 40 + 'px'
            })
            obj.children().last().css({
                'transform': 'rotate(180deg)'
            })
        } else {
            obj.parent().css({
                'height': 40 + 'px'
            })
            obj.children().last().css({
                'transform': 'rotate(0deg)'
            })
        }
        h_judge = !h_judge

    }
    function jumpPage(obj) {
        switch (obj.attr('page-data')) {
            case 'page1': location.href = './flgl.html';
            break
            case 'page2': location.href = './kcgl.html';
            break
            case 'page3': location.href = './rkgl.html';
            break
            case 'page4': location.href = './yjxxsz.html';
            break
            case 'page5': location.href = './ckgl.html';
            break
            case 'page6': location.href = './yhgl.html';
            break
            case 'page7': location.href = './xgmm.html';
            break
            }
        let page
        sessionStorage.setItem('page', obj.attr('page-data'))
    }
  tabClick(li1[0],0)
     showTable(allData)
     showDiv(allData)
    goPage(dangqianye)
    
</script>
</html>